<template>
  <div>
    <el-form label-width="80">
      <el-row>
        <el-col :span="11">
          <el-form-item label="检测项目："> <span v-html="proxy.getSupAndSub(form.jcxmName)"></span></el-form-item>
        </el-col>
        <el-col :span="13">
          <el-form-item label="样品编号：">{{ form.sampleCode }}</el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="11">
          <el-form-item label="报告值：">{{ form.value }}<div v-html="proxy.getSupAndSub(form.checkLimitUnit)"></div></el-form-item>
        </el-col>
        <el-col :span="13">
          <el-form-item label="检测人："><span>{{ form.createUserName }}</span></el-form-item>
        </el-col>
      </el-row>
      <el-form-item label="现场原始记录：" label-width="120">
        <div style="color: var(--theme-deep-color);cursor: pointer;width:100%" @click="handleTable(item.taskId)"
          v-for="item in form.myTaskList">{{ item.tableName }}<br /></div>
      </el-form-item>
      <el-form-item label="实验室原始记录：" label-width="120"><span style="color: var(--theme-deep-color);cursor: pointer;"
          @click="handleView(form.lMId)">{{ form.tableName }}</span></el-form-item>
    </el-form>
    <checkDialog ref="checkRef" @close="close"></checkDialog>
    <el-dialog :class="'el-dialog-theme3'" v-model="tableShow" title="查看原始记录表详情" fullscreen>
      <formList ref="formListRef" @callback="callback"/>
    </el-dialog>
  </div>
</template>

<script setup>
import { getTraceForm } from "@/api/dataAnalysis/selectProject";
import checkDialog from "@/views/lab/labTask/checkDialog";
import formList from "@/views/cyCheck/public/common/formList";

import { nextTick } from "vue";

const { proxy } = getCurrentInstance();
const sJId = ref("");
const checkRef = ref(null)
const formListRef = ref(null)
const tableShow = ref(false);
const props = defineProps({
  sJId: {
    type: String,
  },
});

const form = ref({});

function getForm() {
  nextTick(() => {
    sJId.value = props.sJId;
    getTraceForm(sJId.value).then((res) => {
      form.value = res.data;
    });
  });
}
function callback(){
  tableShow.value = false;
}
function close(val) {
}

function handleView(taskId) {
  checkRef.value.handleCheck(taskId, true)
}

function handleTable(taskId) {
  tableShow.value = true;
  nextTick(() => {
    formListRef.value.getInfo(taskId,true)
  });
}


getForm();

defineExpose({
  getForm,
});
</script>
